import React from "react";
import { Button, Popconfirm, Space, Switch, Tag } from "antd";

/**
 * 菜单表格列配置
 * @param onEdit 编辑回调
 * @param onDelete 删除回调
 * @returns 列配置
 */
export const menuTableColumns = (onEdit: (record: any) => void, onDelete: (record: any) => void) => {
  return [
    {
      title: "菜单名称",
      dataIndex: "menu_name",
      key: "menu_name",
      width: 180,
    },
    {
      title: "菜单标识",
      dataIndex: "menu_key",
      key: "menu_key",
      width: 150,
    },
    {
      title: "路由路径",
      dataIndex: "menu_path",
      key: "menu_path",
      width: 180,
    },
    {
      title: "图标",
      dataIndex: "icon",
      key: "icon",
      width: 100,
      render: (text: string) => (
        text ? <span className="text-lg">{React.createElement(getIconByName(text))}</span> : "-"
      )
    },
    {
      title: "排序",
      dataIndex: "sort_order",
      key: "sort_order",
      width: 80,
    },
    {
      title: "菜单类型",
      dataIndex: "menu_type",
      key: "menu_type",
      width: 100,
      render: (text: string) => (
        <Tag color={text === "menu" ? "blue" : "purple"}>
          {text === "menu" ? "菜单" : "按钮"}
        </Tag>
      ),
    },
    {
      title: "可见性",
      dataIndex: "visible",
      key: "visible",
      width: 80,
      render: (text: boolean) => (
        <Tag color={text ? "green" : "red"}>
          {text ? "可见" : "隐藏"}
        </Tag>
      ),
    },
    {
      title: "状态",
      dataIndex: "status",
      key: "status",
      width: 80,
      render: (text: number) => (
        <Tag color={text === 1 ? "success" : "error"}>
          {text === 1 ? "启用" : "禁用"}
        </Tag>
      ),
    },
    {
      title: "操作",
      key: "action",
      width: 150,
      render: (_: any, record: any) => (
        <Space size="small">
          <Button type="link" size="small" onClick={() => onEdit(record)}>
            编辑
          </Button>
          <Popconfirm
            title="确定要删除此菜单吗?"
            onConfirm={() => onDelete(record)}
            okText="确定"
            cancelText="取消"
            disabled={record.is_fixed}
          >
            <Button 
              type="link" 
              danger 
              size="small" 
              disabled={record.is_fixed}
            >
              删除
            </Button>
          </Popconfirm>
        </Space>
      ),
    },
  ];
};

/**
 * 图标映射表
 */
export const IconMap: Record<string, any> = {
  // 通过动态导入添加更多图标
  "HomeOutlined": require('@ant-design/icons').HomeOutlined,
  "UserOutlined": require('@ant-design/icons').UserOutlined,
  "SettingOutlined": require('@ant-design/icons').SettingOutlined,
  "AppstoreOutlined": require('@ant-design/icons').AppstoreOutlined,
  "DashboardOutlined": require('@ant-design/icons').DashboardOutlined,
  "ApartmentOutlined": require('@ant-design/icons').ApartmentOutlined,
  "ContainerOutlined": require('@ant-design/icons').ContainerOutlined,
  "FieldTimeOutlined": require('@ant-design/icons').FieldTimeOutlined,
  "ProfileOutlined": require('@ant-design/icons').ProfileOutlined,
  "NotificationOutlined": require('@ant-design/icons').NotificationOutlined,
  "BarChartOutlined": require('@ant-design/icons').BarChartOutlined,
  "FileOutlined": require('@ant-design/icons').FileOutlined,
  "TeamOutlined": require('@ant-design/icons').TeamOutlined,
  "ToolOutlined": require('@ant-design/icons').ToolOutlined,
  "SecurityScanOutlined": require('@ant-design/icons').SecurityScanOutlined,
  "SafetyCertificateOutlined": require('@ant-design/icons').SafetyCertificateOutlined,
};

/**
 * 从字符串获取图标组件
 */
export const getIconByName = (name: string) => {
  return IconMap[name] || null;
}; 